<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /* 后代选择器 使用空格分割*/
        /* .home的后代必须是span，才能生效 */
        /* .home span{
            color: aqua;
        } */

        /* 直接子代选择器，必须是子代才能生效 使用 > 分割 */
        .home > span{
            color: aqua;
        }
    </style>
</head>
<body>

    <div class="home">
        <span>啦啦啦</span>
        <div class="box">
            <span>呵呵呵</span>
        </div>
        <div class="content">
            <div class="desc">
                <p>
                    <span>哈哈哈</span>
                </p>
            </div>
        </div>
    </div>

    <span>test</span>
</body>
</html>